Что такое Google Tag Manager: настройка и установка менеджера тегов

Внести изменения в код сайта и ничего не сломать – такую задачу сможет выполнить даже «гуманитарий». Для этого Google разработал Диспетчер тегов (Tag Manager). С его помощью можно легко добавить нужные коды на сайт без участия IT-специалиста. Какие задачи решит этот инструмент и почему он может стать незаменимым?

Google Tag Manager (GMT, Диспетчер тегов) – сервис для управления JavaScript и HTML-кодами сторонних служб на сайте или в приложении. Для этого на сайт один раз устанавливается специальный код, а остальные теги можно добавлять уже в Диспетчере. Если сайт и его аналитика связаны со множеством сторонних сервисов и ресурсов, то Google Tag Manager будет удобным решением для организации работы с ними.

Узнайте больше про сквозную и предиктивную аналитику. Посмотрите выпуск с руководителем отдела аналитики MediaNation Александром Вахтиным и аналитиком больших данных Романом Святовым:

Как это работает?

Чтобы сторонний сервис (например, Google Analytics) смог собрать данные с сайта о посещениях, заполнении формы обратной связи и других событиях, в код сайта необходимо прописать специальный фрагмент HTML или JavaScript. Причем для каждого события и для каждого сервиса это будет свой отдельный код. Представьте, сколько уйдет времени на то, чтобы добавить их на страницы сайта. И сколько посторонних фрагментов будет в исходном коде. Все это в итоге приведет к медленной загрузке сайта и возможным сбоям в его работе (если фрагмент кода будет добавлен неправильно). Вот здесь на помощь и приходит Google Tag Manager.

На сайт один раз устанавливается специальный код, а остальные – можно добавлять уже в аккаунте Tag Manager. Например, вам нужно установить пиксель ретаргетинга ВКонтакте. Вместо того, чтобы открывать исходный код вашего сайта, искать подходящее место, добавлять в него код пикселя ВКонтакте, вы просто добавляете код пикселя в контейнер Google Tag Manager. Без риска, что навредите работе сайта. Здесь это сделать сложно. Вместе с установкой вы можете настроить триггер активации и собрать интересующую вас аудиторию (например, только ту, что посетила страницу с контактами компании).

Какие задачи решит Google Tag Manager

Итак, как мы выяснили, для расширения функциональности сайта и подключения новых сервисов не нужно будет каждый раз добавлять код на сайт. Все это можно делать в GTM. Вот какие возможности будут доступны (и это всего лишь часть):

• установить на сайт теги ремаркетинга для работы с Google Ads, Facebook, ВКонтакте, DoubleClick и т.д.;
• подключить отправку данных в системы аналитики (Яндекс.Метрику, Google Analytics, AppsFlyer и др.);
• отследить переходы по внешним ссылкам и внутри сайта;
• уточнить показатель отказов;
• узнать источники внешнего трафика;
• отследить клики по виджетам соцсетей;
• добавить на сайт кнопки шеринга;
• установить подмену номера;
• отследить взаимодействие с контактной формой на сайте.

Кому и зачем

Диспетчер тегов нет смысла устанавливать только в том случае, когда отслеживаются базовые показатели. Для этих целей подойдут Google Analytics и Яндекс.Метрика. Также вряд ли пригодится Диспетчер, если вы не используете вспомогательные сервисы (виджеты, онлайн-мессенджеры, инструменты для A/B тестирования и т.д.). Кому Google Tag Manager точно будет полезен? Специалистам по маркетингу и веб-аналитикам он поможет отследить важные KPI сайта, самостоятельно внедрить сервисы на сайте без помощи программистов и создать эффективную систему аналитики. Для специалистов по контекстной рекламе GTM упростит ремаркетинг и позволит лучше оценить рекламные кампании и их эффективность. Владельцам небольших компаний этот инструмент поможет уменьшить расходы на услуги программистов, а агентствам интернет-маркетинга Диспетчер тегов упрощает работу с аккаунтами клиентов и их проектами.

Краткий словарь

У GTM есть своя иерархия, и во главе нее стоит аккаунт. Здесь содержатся все данные для работы с диспетчером тегов. С одной учетной записи Google можно создать при необходимости несколько аккаунтов в GTM. В каждом создается и настраивается один или несколько контейнеров.

Контейнер – это набор всех тегов, триггеров, переменных. Контейнер представляет собой главный JavaScript-код, который добавляется на все страницы сайта.

Тег – фрагмент Java- или HTML-кода, который передает данные в систему, например, в Google Analytics. С помощью установленных тегов можно отслеживать поведение посетителей сайта, запускать ремаркетинг, таргетинг, менять контент для A/B тестов и многое другое. В Google Tag Manager есть готовые шаблоны тегов для большинства популярных сервисов (AdRoll, Google Ads, K50, AppsFlyer, adjust и другие). Полный список можно посмотреть здесь. 

Теги активируются в ответ на события, которые произошли на сайте. И для этого нужно подключить триггеры.

Триггер – действие пользователя (условие), при котором тег срабатывает и начинается работа сервиса. Триггером может быть заполнение формы, клик по элементам или ссылкам, просмотр видео и т.д. Для триггеров доступны настройки в виде переменных.

Переменные – метки-заполнители для меняющихся значений. В Диспетчере тегов переменные задают условия активации и уточняют триггеры и теги. Например, переменная Video Percent показывает процент воспроизведенного видео в момент, когда произошло событие (к примеру, пользователь перешел по ссылке).

Уровень данных – объект, который содержит все данные для передачи в менеджер тегов. Создавать его необязательно, однако он упростит передачу данных с веб-страницы или из мобильного приложения тегам, триггерам и другим переменным Диспетчера тегов.

Какие задачи решит Google Tag Manager

Для расширения функциональности сайта и подключения новых сервисов не нужно будет каждый раз добавлять код на сайт. Все это можно делать в GTM. Вот лишь часть возможностей:

• установить на сайт теги ремаркетинга для работы с Google Ads, Facebook, ВКонтакте, DoubleClick и т.д.;
• узнать источники внешнего трафика;
• установить подмену номера;
• отследить взаимодействие с контактной формой на сайте.

Обзор

Чтобы начать работу, необходимо зайти в аккаунт Google (или создать, если его нет) и зайти на сайт https://tagmanager.google.com 

Далее создаем отдельный аккаунт для GTM.

Заполняем форму, где указываем название аккаунта, страну, название контейнера, а также выбираем, где он будет использоваться:

После этого Диспетчер тегов сформирует код, который нужно добавить на каждую страницу сайта

В разделе «Администрирование» вы можете настроить доступ к аккаунту или к отдельному контейнеру, посмотреть статистику, импортировать или экспортировать контейнер и др.

Рабочая область выглядит следующим образом. Также есть возможность добавить еще две рабочих области.

На данный момент доступно более 50 типов тегов. Часть из них – это сервисы Google, но есть и некоторые популярные платформы.

С функцией «Предварительный просмотр» можно протестировать изменения конфигурации контейнера перед его публикацией/

Преимущества

Диспетчер тегов изначально разрабатывался для маркетологов (как пишет Google[1]). Именно поэтому сервис максимально удобный и относительно простой для использования не программистами. Добавлять новые сервисы или изменять коды на сайте можно без помощи IT-отдела.

Возможность самостоятельно проверить работу новых тегов перед внесением изменений на сайт. Для этого в GTM есть специальные инструменты: консоль отладки и режим предварительного просмотра. А если что-то пошло не так, то будет легко отменить внесенные изменения.

Поддержка тегов других служб (AdAdvisor, adjust, AdRoll, AppsFlyer, K50 и др.) значительно упрощает работу. Для многих в Диспетчере уже есть готовые шаблоны тегов.

GTM работает не только с веб-сайтами, но и с приложениями. Причем настройку можно сделать даже после загрузки приложения пользователями.

Диспетчер тегов помогает эффективнее организовать работу с дополнительными сервисами на сайте: формы, чаты, рекламные платформы, коллтрекинговые системы и другие инструменты. Для каждого из них требуется установка кодов на сайт, а это в свою очередь может замедлить загрузку страниц. Плюс ко всему, можно потеряться в таком большом количестве посторонних кодов.

Google Tag Manager – полностью бесплатный инструмент, без премиум-доступов и расширенных возможностей за дополнительную плату. Кроме того, Google обещает добавление в него новых полезных функций.

Можно предоставить права доступа другим пользователям на уровне аккаунта или контейнера. Также есть возможность создать Рабочие области. В них будете создаваться разные наборы изменений для одного и того же контейнера. Для каждого специалиста или отдела можно будет создать свою рабочую область, в которой будут тестироваться и меняться конфигурации тегов. При этом рабочие конфигурации затрагиваться не будут.

Сложности, которые могут возникнуть:

• Для установки более сложных настроек (например, создание пользовательских тегов) необходимо знание HTML, JavaScript и CSS.
• Если контейнер повредится при обновлении кода, то работа всех систем отслеживания на сайте может сбиться. Негативно повлияет на работу и тег, который конфликтует с кодом сайта. Так что работа с Менеджером тегов требует повышенной внимательности и осторожности.

Вывод

Google Tag Manager – инструмент, на который определенно стоит обратить внимание. Он не даст запутаться в большом количестве сторонних кодов, предотвратит медленную загрузку сайта из-за них, поможет самостоятельно подключать различные сервисы к сайту и добавлять новые скрипты. Диспетчер тегов сделает работу с аналитикой намного проще и эффективнее. А если вы не готовы к самостоятельной аналитике сайта, то вы всегда можете обратиться в MediaNation.